import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:get/get.dart';
import 'package:share_fit/app/components/back_btn_icon.dart';
import 'package:share_fit/app/controllers/space/space_const.dart';
import 'package:share_fit/app/helper/ext/tr_ext.dart';
import 'package:share_fit/app/tools/color_const.dart';
import 'package:share_fit/app/tools/log_utils.dart';
import 'package:share_fit/app/ute/uteped_const.dart';
import 'package:share_fit/generated/locales.g.dart';

import 'space_logic.dart';

class StepsPage extends StatelessWidget {

  final logic = Get.put(SpaceLogic());

  @override
  Widget build(BuildContext context) {
    int selectedValue = 0;

    return Scaffold(
        appBar: AppBar(
          title: Text(LocaleKeys.space_steps.ts, style: TextStyle(fontSize: 54.sp, color: ColorConst.btnFontColor),),
          centerTitle: true,
          leading: BackBtnIcon(onTap: () => Get.back()),
        ),
      body: Container(
        // padding: EdgeInsets.only(top: 50),
        child: Column(
          children: [
            Container(
              child: Stack(
                children: [
                  Container(
                      height: 600.h,
                      margin: EdgeInsets.only(top: 240.h),
                    child: CupertinoPicker(
                        diameterRatio: 1,
                        useMagnifier: true,
                        magnification: 2,
                        squeeze: 0.6,
                        itemExtent: 25,
                        onSelectedItemChanged: (value){
                          selectedValue = value;
                        },
                        children: SpaceConst.targetSteps.map((e) {
                          return Text(e.toString());
                        }).toList())
                  ),

                    Container(
                      alignment: Alignment.centerRight,
                      margin: EdgeInsets.only(top: 500.h, right: 150.w),
                      padding: EdgeInsets.only(right: 45.w),
                      child: Text(LocaleKeys.step.ts,
                          style: TextStyle(
                            fontSize: 54.sp,
                            color: Color(0xFF898C8F),
                          )),
                    )
                ],
              ),
            ),
                  Expanded(child: Container()),
                  Row(
                    children: [
                      Expanded(
                          child: Container(
                            height: 135.h,
                            margin: EdgeInsets.fromLTRB(42.w, 0, 42.w, 176.h),
                            child: ElevatedButton(
                              onPressed: () {
                                int setps = SpaceConst.targetSteps[selectedValue];
                                // logic.save("space_steps", setps, global: true);
                                logic.save("sport_target_step", setps, global: true);
                                logic.save("sport_target_step_index", selectedValue, global: true);
                                logic.setCount(setps);


                                int calorie = logic.read('sport_target_calorie', defaultValue: SpaceConst.targetCalories[0], global: true);
                                int distance = logic.read('sport_target_distance', defaultValue: SpaceConst.targetDistances[0], global: true);
                                int duration = logic.read('sport_target_duration', defaultValue: SpaceConst.targetDurations[0], global: true);
                                Map<String, Object> maps = {'step':SpaceConst.targetSteps[selectedValue], 'calorie':calorie, 'distance': distance, 'duration':duration};
                                Map<String, Object> params = {UTEPedConst.keyValue: maps};
                                logic.setMotionGoal(params, back: (value) {
                                  logger.d('=====>>> setStep $value');
                                });
                                Get.back();
                              },
                              style: ButtonStyle(
                                  backgroundColor: MaterialStateProperty.all(ColorConst.activeColor),
                                  shape: MaterialStateProperty.all(RoundedRectangleBorder(
                                      borderRadius: BorderRadius.circular(10)
                                  ))
                              ),
                              child: Text(LocaleKeys.person_save.ts, style: TextStyle(fontSize: 48.sp, color: Colors.white, ),),
                            ),
                          )),
                    ],
                  )
          ],
        ),
      )
    );
  }

}
